<template>
  <div class="page-continue">
    <div class="headimg" :style="{backgroundImage:'url('+pic+')'}"></div>
    <!-- <el-input
      placeholder="请输入搜索关键字"
      @keyup.enter="select"
      suffix-icon="el-icon-search"
      v-model="selectinput"
    ></el-input>-->
    <el-input placeholder="请输入搜索关键字" @keyup.enter.native="selectaction" v-model="selectinput">
      <i slot="suffix" @click="selectaction" class="el-input__icon el-icon-search"></i>
    </el-input>
    <TagModel
      v-for="item in tags"
      :key="item.tagsId"
      :tag-name="item.tagsName"
      :type-list="item.typeSends"
    ></TagModel>
  </div>
</template>

<script>
import typeApi from "@/assets/api/type.js";
import TagModel from "@/components/index/TagModel.vue";

export default {
  data() {
    return {
      tags: [],
      select: 0,
      pic: require("@/assets/63170723_p0_master1200.jpg"),
      selectinput: ""
    };
  },
  mounted() {
    typeApi.getType().then(res => {
      this.tags = res.data.tags;
      this.tags.forEach(val => {
        val.typeSends.forEach(val2 => {
          val2.id = val2.typeId;
          val2.imgUrl = val2.typeIcon;
        });
      });
    });
  },
  methods: {
    selectaction() {
      this.$router.push({
        path: "/select/" + this.selectinput
      });
    }
  },
  components: {
    TagModel
  }
};
</script>



<style lang="scss" scoped>
.el-input {
  margin: 10px 0;
}
</style>

<style lang="scss">
body {
  background-color: #fafafa;
}
.headimg {
  width: 100%;
  height: 20vh;
  background-size: cover;
  background-position: center center;
}
</style>